<template>
	<view>
		<view class="box">
			<h3>{{lineStr}}</h3>
			<p>
				<view>车牌号：</view>
				<input v-model="driverInfo.car_plate" placeholder="请输入车牌号" type="text">
			</p>
			<p>
				<view>姓&nbsp;&nbsp;&nbsp;名：</view>
				<input v-model="driverInfo.name" placeholder="请输入姓名" type="text">
			</p>

			<!-- 			<view class="nns">
				<view class="mm">
					<p>身份证：</p>
					<image :src="driverInfo.card_img || addImg " @click="chooseImg(1)" mode=""></image>
				</view>
				<view class="mm">
					<p>驾驶证：</p>
					<image :src="driverInfo.drive_img || addImg " @click="chooseImg(2)" mode=""></image>
				</view>
				<view class="mm">
					<p>行驶证：</p>
					<image :src="driverInfo.license_img || addImg " mode=""></image>
				</view>
				<view class="mm">
					<p>运营证：</p>
					<image :src="driverInfo.operate_img || addImg " mode=""></image>
				</view>
				<view class="mm">
					<p>上岗证：</p>
					<image :src="driverInfo.work_img || addImg " mode=""></image>
				</view>
			</view> -->

			<p style="clear: both;">
				<view style="font-size: 18px;font-weight: 600;">手机号：</view>
				<input v-model="driverInfo.mobile" placeholder="请输入手机号" type="text">
			</p>

			<!-- 			<p>
				<view style="font-size: 18px;font-weight: 600;">验证码：</view>
				<input v-model="smsCode" style="width: 60%;" placeholder="请输入验证码" type="text">
				<span @click="index_sendSms()"
					style="height: 50px;border-bottom: 1px solid #EEEEEE; padding-right: 20px;font-size: 18px;font-weight: 600;color: #1890FF;">{{s}}</span>
			</p> -->

			<button @click="tj()">提交</button>

		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				s: "获取",
				lineinfo: {},
				driverInfo: {
					card_img: '../../static/add.png',
					drive_img: '../../static/add.png',
				},
				addImg: '../../static/add.png',
				smsCode: '',
				uploadImgUrl: '',
				uploadImgType: 1,
				uploadImgFullUrl: '',
			}
		},
		onLoad(x) {
			console.log(x);
			let { car_plate, muzzle_id } = x;
			console.log('car_plate', car_plate);
			console.log('muzzle_id', muzzle_id);
			this.index_getlineinfo(car_plate, muzzle_id)
		},
		computed: {
			lineStr() {
				let line_info = this.lineinfo.line_info
				let json_line = line_info.json_line;

				let json_line_arr = JSON.parse(json_line)

				let fields = json_line_arr.map(item => `${item.outlet_name}`).join("-");
				console.log('fields', fields);
				return fields;
			}
		},
		methods: {
			// 提交信息
			tj() {
				let data = {
					id: this.driverInfo.id,
					name: this.driverInfo.name,
					card_img: this.driverInfo.card_img,
					drive_img: this.driverInfo.drive_img,
					mobile: this.driverInfo.mobile,
					sms_code: this.smsCode,
				}
				console.log(data)
				if (!data.name) {
					uni.showToast({ title: '请输入姓名', icon: 'none' })
					return;
				}
				// if (!data.card_img) {
				// 	uni.showToast({ title: '请输入身份证', icon: 'none' })
				// 	return;
				// }
				// if (!data.drive_img) {
				// 	uni.showToast({ title: '请输入驾驶证', icon: 'none' })
				// 	return;
				// }
				// if (!data.sms_code) {
				// 	uni.showToast({ title: '请输入短信验证码', icon: 'none' })
				// 	return;
				// }
				this.$rqt.cars_restock(data).then(res => {
					console.log(res)
					if (res.code == 1) {
						uni.showToast({ title: res.msg, icon: "success", })
						setTimeout(() => {
							uni.navigateBack()
						}, 850)
					} else {
						uni.showToast({ title: res.msg, icon: 'none' })
					}
				})
			},
			//发送短信
			index_sendSms() {
				if (this.s == "获取") {
					this.s = 60;
					let data = { mobile: this.driverInfo.mobile }
					this.$rqt.index_sendSms(data).then(res => {
						console.log(res);
						uni.showToast({ title: res.msg, icon: "success", });
						this.time()
					})
				} else {

				}
			},
			index_getlineinfo(car_plate, muzzle_id) {
				let data = { car_plate, muzzle_id, }
				this.$rqt.index_getlineinfo(data).then(res => {
					console.log('res: ', res);
					let { code, data } = res;
					if (code == 1) {
						this.lineinfo = data;
						this.driverInfo = this.lineinfo.car_info;
					} else {

					}
				})
			},
			chooseImg(type) {
				let that = this;
				this.uploadImgType = type;
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'],
					success: function(res) {
						console.log(res.tempFilePaths);
						let img_tmp = res.tempFilePaths[0];
						console.log(img_tmp);
						that.uploadImgUrl = img_tmp || '';
						that.upload()
					}
				});
			},
			upload() {

				let img = this.uploadImgUrl;
				if (img) {
					uni.showLoading({ title: '上传中' })
					this.$rqt.uploadPhoto(img, (res) => {
						let data = JSON.parse(res.data);
						uni.hideLoading()
						console.log(data);
						if (data.code == 1 && data.data) {
							let { fullurl } = data.data;
							this.uploadImgFullUrl = fullurl || '';
							this.setUploadImg();
						}
					}, (err) => {
						uni.hideLoading()
						console.log(err);
					})
				}
			},
			setUploadImg() {
				let type = this.uploadImgType;
				let imgUrl = this.uploadImgFullUrl;
				switch (type) {
					case 1:
						this.driverInfo.card_img = imgUrl;
						break;
					case 2:
						this.driverInfo.drive_img = imgUrl;
						break;
					default:
						break;
				}
			},
		}
	}
</script>

<style scoped>
	button {
		margin: 0 auto;
		width: 86%;
		height: 50px;
		background: #1890FF;
		box-shadow: 0px 0px 4px 0px rgba(204, 204, 204, 0.5);
		border-radius: 25px;
		font-size: 18px;
		font-weight: 600;
		color: #FFFFFF;
		margin-top: 50px;
		margin-bottom: 30px;
	}

	.nns {
		width: 90%;
		margin: 0 auto;
	}

	.mm {
		width: 50%;
		float: left;
		margin-top: 10px;
	}

	.box {
		width: 100%;
	}

	.mm>p {
		font-size: 18px;
		font-weight: 600;
	}

	.mm>image {
		width: 80px;
		height: 80px;
		margin-top: 10px;
	}

	.box>p {
		display: flex;
		line-height: 50px;
		width: 90%;
		margin: 0 auto;
	}

	.box>p>input {
		width: 70%;
		height: 50px;
		border-bottom: 1px solid #EEEEEE;
	}

	.box>h3 {
		text-align: center;
		margin-top: 25px;
	}
</style>